<template>
    <!-- crumb -->
    <div class="crumb">
        <div class="block">  
            <div class="crumbL">
                <a href="#">首页 </a>
                <em>></em>
                <a href="#" class="crumbLa">创新产品</a>
                <div class="clear"></div>
            </div>
            <div class="crumbR">
                <a href="#">公司简介</a>
                <a href="#">经营理念</a>
                <a href="#">社会责任</a>
                <a href="#">加入我们</a>
                <a href="#">联系我们</a>
                <div class="clear"></div>
            </div>
            <div class="clear"></div>
        </div>
    </div>

</template>

<script>
import $ from "jquery";

export default {
  name: "crumb",
  data() {
    return {
      
    };
  },
  
};
</script>

<style scoped>
    /* crumb */
    .crumb{
        width: 100%;
        height: auto;
        background: #fff;
        border-bottom: 1px solid #ebebeb;
        line-height: 51px;
    }
    .crumbL{
        float: left;
    }
    .crumbL a{
        display: block;
        float: left;
        font-size: 14px;
        color: #333;
    }
    .crumbL a.crumbLa{
        color: #999;
    }
    .crumbL a:hover{
        text-decoration: underline;
    }
    .crumbL em{
        display: block;
        float: left;
        font-size: 14px;
        color: #333;
        margin: 0px 5px;
    }
    .crumbR{
        float: right;
    }
    .crumbR a{
        display: block;
        float: left;
        font-size: 14px;
        color: #333;
        margin-left: 10px;
    }
    .crumbR a:hover{
        color: #e70012;
    }

    /* 媒体查询 */
    /** max-width:1024px **/
    @media only screen and (max-width: 1023px){
        .crumb{
            display: none;
        }
        
    }
</style>